<template>
  <div class="page-bd">
    <!-- 页面内容-->
    <div class="user-top">
      <div class="user-top__hd weui-cell">
        <div class="weui-cell__hd">
          <img src="../assets/tx.jpg" alt="">
        </div>
        <div class="weui-cell__bd">
          <p class="name fs28 fw500">~小情调天使~</p>
          <p class="lever fs26">当前等级：初级矿工</p>
        </div>
      </div>
      <div class="user-top_bd pd0" style="align-content: baseline;">
        <div class="lever">
          <span>距离下一个等级：</span>
          <div class="weui-progress">
            <div class="weui-progress__bar">
              <div class="weui-progress__inner-bar js_progress" style="width: 50%;"></div>
            </div>
            <p class="nums"><span class="color1 fw500 fs28">20</span>台矿机</p>
          </div>
        </div>
        <div class="weui-flex">
          <div class="weui-flex__item">
            <p class="name">4台D1</p>
            <p class="text">个人自用</p>
          </div>
          <div class="weui-flex__item">
            <p class="name">4台D1</p>
            <p class="text">一代累计</p>
          </div>
          <div class="weui-flex__item">
            <p class="name">4台D1</p>
            <p class="text">其他累计</p>
          </div>
        </div>
      </div>
    </div>
    <div class="user-data weui-flex bor-1px-b border-after_none border-befor_none">
      <div class="weui-flex__item">
        <div class="weui-flex__item_bd">
          <p class="nums">120</p>
          <p class="text">一代矿机数（台）</p>
        </div>
        <div class="weui-flex__item_ft weui-flex">
          <div class="weui-flex__item">
            <p class="lever">D1</p>
            <p class="num">30台</p>
          </div>
          <div class="weui-flex__item">
            <p class="lever">D2</p>
            <p class="num">30台</p>
          </div>
          <div class="weui-flex__item">
            <p class="lever">D3</p>
            <p class="num">30台</p>
          </div>
          <div class="weui-flex__item">
            <p class="lever">D4</p>
            <p class="num">30台</p>
          </div>
        </div>

      </div>
      <div class="weui-flex__item">
        <div class="weui-flex__item_bd">
          <p class="nums">400</p>
          <p class="text">矿池总矿机数（台）</p>
        </div>
        <div class="weui-flex__item_ft weui-flex">
          <div class="weui-flex__item">
            <p class="lever">D1</p>
            <p class="num">30台</p>
          </div>
          <div class="weui-flex__item">
            <p class="lever">D2</p>
            <p class="num">30台</p>
          </div>
          <div class="weui-flex__item">
            <p class="lever">D3</p>
            <p class="num">30台</p>
          </div>
          <div class="weui-flex__item" style="border-right-width:0px;">
            <p class="lever">D4</p>
            <p class="num">30台</p>
          </div>
        </div>

      </div>
    </div>
    <div class="user-list weui-cells">
      <div class="c_tlt">
        <span>我的直推团队</span>

      </div>
      <div class="weui-cell user-list_li border-befor_none">
        <div class="weui-cell__hd">
          <img src="../assets/tx.jpg" alt="">
        </div>
        <div class="weui-cell__bd">
          <p class="phone fs26" style="color: #282c37;">手机：138****4512</p>
          <p class="lever fs26" style="color: #606470;">
            <span>D1-10台 </span>
            <span>D2-10台</span>
            <span>D3-10台 </span>
            <span>D4-10台 </span>
          </p>
        </div>
      </div>
      <div class="weui-cell user-list_li">
        <div class="weui-cell__hd">
          <img src="../assets/tx.jpg" alt="">
        </div>
        <div class="weui-cell__bd">
          <p class="phone fs26" style="color: #282c37;">手机：138****4512</p>
          <p class="lever fs26" style="color: #606470;">
            <span>D1-10台 </span>
            <span>D2-10台</span>
            <span>D3-10台 </span>
            <span>D4-10台 </span>
          </p>
        </div>
      </div>
      <div class="weui-cell user-list_li">
        <div class="weui-cell__hd">
          <img src="../assets/tx.jpg" alt="">
        </div>
        <div class="weui-cell__bd">
          <p class="phone fs26" style="color: #282c37;">手机：138****4512</p>
          <p class="lever fs26" style="color: #606470;">
            <span>D1-10台 </span>
            <span>D2-10台</span>
            <span>D3-10台 </span>
            <span>D4-10台 </span>
          </p>
        </div>
      </div>

    </div>
  </div>

</template>

<script>
  import {mapGetters} from 'vuex';
  export default {
    data() {
      return {

      }
    },
    mounted(){
      this.$store.dispatch("topstatus", true);
    },
  }
</script>

<style scoped>
  .user-data .weui-flex__item + .weui-flex__item .weui-flex__item_bd {
    background-image: url(../assets/kc_img2.png);
  }
</style>
